.share-page {
    position: relative;

    overflow: hidden;

    box-sizing: border-box;
    min-height: 100vh;
    padding: 32rpx;

    background: #f8f8f8;
    &-preview {
        width: 100%;

        background-color: #fff;
        .share-page-img {
            width: 100%;
            min-height: 800rpx;
            max-height: 1188rpx;
        }
        .share-preview-bottom {
            display: flex;
            align-items: center;
            justify-content: space-between;

            padding: 32rpx;
        }
        .share-page-info {
            display: flex;
            flex: 1;
            flex-direction: column;

            box-sizing: border-box;
            width: calc(100% - 250rpx);
            padding: 0 24rpx;

            color: #999999;

            font-family: PingFangSC-Regular, PingFang SC;
            font-size: 28rpx;
            font-weight: 400;
            .nickname {
                overflow: hidden;

                width: 100%;
                margin-bottom: 16rpx;

                white-space: nowrap;
                text-overflow: ellipsis;

                color: #333333;

                font-family: PingFangSC-Medium, PingFang SC;
                font-size: 32rpx;
                font-weight: 500;
                line-height: 44rpx;
            }
        }
        .share-page-avatar {
            width: 112rpx;
            min-width: 112rpx;
            height: 112rpx;

            border-radius: 50%;
        }
        .share-page-qrcode {
            width: 148rpx;
            min-width: 148rpx;
            height: 148rpx;
        }
    }
    .msg-box {
        display: flex;
        align-items: center;
        justify-content: center;

        text-align: center;
    }
    .share-page-box {
        position: relative;

        overflow: hidden;

        margin: 40rpx auto;

        box-shadow: 0rpx 6rpx 20rpx 6rpx rgba(0, 0, 0, 0.2);
    }
    .share-page-btn {
        margin-top: 38rpx;
        button {
            display: flex;
            align-items: center;
            justify-content: center;

            width: 600rpx;
            height: 88rpx;

            color: #ffffff;
            border-radius: 44rpx;
            background: linear-gradient(270deg, #ff5356 0%, #fe292b 100%);

            font-family: PingFangSC-Medium, PingFang SC;
            font-size: 32rpx;
            font-weight: 500;
        }
    }
    .canvasdrawer {
        position: absolute;
        top: -199998rpx;
        left: -199998rpx;

        transform: scale(0);
    }
    .photo-view-default {
        position: relative;
        z-index: 1000000;
    }
    .photo-popup-tip {
        padding: 0 50rpx 84rpx;

        text-align: center;

        color: #33302d;

        font-family: PingFangSC-Medium, PingFang SC;
        font-size: 32rpx;
        font-weight: 500;
        line-height: 34rpx;
    }
    .photo-popup {
        width: 543rpx;
        padding: 82rpx 0 48rpx;

        border-radius: 14rpx;
        background: #ffffff;
    }
    .photo-last {
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .photo-btn {
        width: 263rpx;
        height: 65rpx;

        text-align: center;

        color: #ffffff;
        border-radius: 40rpx;
        background: linear-gradient(270deg, #ff5356 0%, #fe292b 100%);

        font-family: PingFangSC-Medium, PingFang SC;
        font-size: 25rpx;
        font-weight: 500;
        line-height: 65rpx;
    }
}
